<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1 , user-scalable=no">
    <title>微电影</title>
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/static/base/images/logo.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/bootstrap-movie.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/static/base/css/animate.css">
    <!--底部-->
    <script src="${pageContext.request.contextPath}/resource/static/base/js/jquery.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/static/base/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/static/base/js/jquery.singlePageNav.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/static/base/js/wow.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/static/lazyload/jquery.lazyload.min.js"></script>
    <script src="//cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>
    <style>
        .navbar-brand>img {
            display: inline;
        }

    </style>
    <style>
        .media{
            padding:3px;
            border:1px solid #ccc
        }

    </style>
</head>
<body>
<!--导航-->
<%@include file="includetop.jsp"%>
<%--<nav class="navbar navbar-default navbar-fixed-top">--%>
<%--    <div class="container">--%>
<%--        <!--小屏幕导航按钮和logo-->--%>
<%--        <div class="navbar-header">--%>
<%--            <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">--%>
<%--                <span class="icon-bar"></span>--%>
<%--                <span class="icon-bar"></span>--%>
<%--                <span class="icon-bar"></span>--%>
<%--            </button>--%>
<%--            <a href="/film/index" class="navbar-brand" style="width:250px;">--%>
<%--                <img src="../resource/static/base/images/logo.png" style="height:30px;">&nbsp;微电影--%>
<%--            </a>--%>
<%--        </div>--%>
<%--        <!--小屏幕导航按钮和logo-->--%>
<%--        <!--导航-->--%>
<%--        <div class="navbar-collapse collapse">--%>
<%--            <form class="navbar-form navbar-left" role="search" style="margin-top:18px;">--%>
<%--                <div class="form-group input-group">--%>
<%--                    <input type="text" class="form-control" placeholder="请输入电影名！">--%>
<%--                    <span class="input-group-btn">--%>
<%--                        <a class="btn btn-default"  onclick="doSearch()"><span class="glyphicon glyphicon-search"></span>&nbsp;搜索</a>--%>
<%--                    </span>--%>
<%--                </div>--%>
<%--            </form>--%>
<%--            <ul class="nav navbar-nav navbar-right">--%>
<%--                <li>--%>
<%--                    <a class="curlink" href="/film/index"><span class="glyphicon glyphicon-film"></span>&nbsp;电影</a>--%>
<%--                </li>--%>
<%--                <c:if test="${sessionScope.userName =='' or null == sessionScope.userName}">--%>
<%--                    <li>--%>
<%--                        <a class="curlink" href="/person/tologin"><span class="glyphicon glyphicon-log-in"></span>&nbsp;登录</a>--%>
<%--                    </li>--%>
<%--                    <li>--%>
<%--                        <a class="curlink" href="/person/doRegister"><span class="glyphicon glyphicon-plus"></span>&nbsp;注册</a>--%>
<%--                    </li>--%>
<%--                    <li>--%>
<%--                        <a class="curlink" href="/person/tologinUser"><span class="glyphicon glyphicon-user"></span>&nbsp;会员</a>--%>
<%--                    </li>--%>
<%--                </c:if>--%>
<%--                <c:if test="${sessionScope.userName !='' and null != sessionScope.userName}">--%>
<%--                    <li>--%>
<%--                        <a class="curlink" href="/person/toUserInformation"><span class="glyphicon glyphicon-user"></span>&nbsp;${sessionScope.userName}</a>--%>
<%--                    </li>--%>
<%--                    <li>--%>
<%--                        <a class="curlink" href="/person/layout"><span class="glyphicon glyphicon-log-out"></span>&nbsp;退出</a>--%>
<%--                    </li>--%>

<%--                </c:if>--%>
<%--            </ul>--%>
<%--        </div>--%>
<%--        <!--导航-->--%>

<%--    </div>--%>
<%--</nav>--%>
<!--导航-->
<!--内容-->
<!--内容-->
<!--热门电影-->
<section id="hotmovie" style="margin-top:76px">
    <div class="container">
        <div class="row wow fadeInRight" data-wow-delay="0.6s">
            <div class="row">
                <%@include file="../1-index-animation/animation.jsp"%>
            </div>
        </div>
    </div>
</section>
<!--热门电影-->
<!--电影列表-->
<section id="movielist">
    <div class="container">
        <div class="row wow fadeIn" data-wow-delay="0.6s">
            <div class="col-md-12 table-responsive">
                <table class="table text-left table-bordered" id="movietags">
                    <tr>
                        <td style="width:10%;">电影标签</td>
                        <td style="width:90%;">
                            <c:forEach items="${videoTags}" var="tags" begin="0" end="4" step="1">
                                <a class="label label-info" onclick="getTag(this)"><span class="glyphicon glyphicon-tag"></span>${tags.tagName}</a>
                            </c:forEach>
                        </td>
<%--                            <a class="label label-info"><span class="glyphicon glyphicon-tag"></span>&nbsp;标签一</a>--%>
<%--                            &nbsp;--%>
<%--                            <a class="label label-info"><span class="glyphicon glyphicon-tag"></span>&nbsp;标签一</a>--%>
<%--                            &nbsp;--%>
<%--                            <a class="label label-info"><span class="glyphicon glyphicon-tag"></span>&nbsp;标签一</a>--%>
<%--                            &nbsp;--%>
<%--                            <a class="label label-info"><span class="glyphicon glyphicon-tag"></span>&nbsp;标签一</a>--%>
<%--                            &nbsp;--%>
<%--                            <a class="label label-info"><span class="glyphicon glyphicon-tag"></span>&nbsp;标签一</a>--%>
                    </tr>
                    <tr>
                        <td>电影星级</td>
                        <td>
                            <a class="label label-warning" onclick="getStar(1)"><span class="glyphicon glyphicon-star"></span>&nbsp;一星</a>
                            &nbsp;
                            <a class="label label-warning" onclick="getStar(2)"><span class="glyphicon glyphicon-star"></span>&nbsp;二星</a>
                            &nbsp;
                            <a class="label label-warning" onclick="getStar(3)"><span class="glyphicon glyphicon-star"></span>&nbsp;三星</a>
                            &nbsp;
                            <a class="label label-warning" onclick="getStar(4)"><span class="glyphicon glyphicon-star"></span>&nbsp;四星</a>
                            &nbsp;
                            <a class="label label-warning" onclick="getStar(5)"><span class="glyphicon glyphicon-star"></span>&nbsp;五星</a>
                        </td>
                    </tr>
                    <tr>
                        <td>上映时间</td>
                        <td>
                            <a class="label label-default" onclick="getYear(${year})"><span class="glyphicon glyphicon-time"></span>&nbsp;${year}</a>
                            &nbsp;
                            <a class="label label-default" onclick="getYear(${year-1})"><span class="glyphicon glyphicon-time"></span>&nbsp;${year-1}</a>
                            &nbsp;
                            <a class="label label-default" onclick="getYear(${year-2})"><span class="glyphicon glyphicon-time"></span>&nbsp;${year-2}</a>
                            &nbsp;
                            <a class="label label-default" onclick="getYear(${year-3})"><span class="glyphicon glyphicon-time"></span>&nbsp;${year-3}</a>
                            &nbsp;
                            <a class="label label-default" onclick="getYear(${year-4})"><span class="glyphicon glyphicon-time"></span>&nbsp;更早</a>
                        </td>
                    </tr>
                    <tr>
                        <td>播放数量</td>
                        <td>
                            <a class="label label-success" onclick="getPlayRank(0)"><span class="glyphicon glyphicon-arrow-down"></span>&nbsp;从高到底</a>
                            &nbsp;
                            <a class="label label-danger" onclick="getPlayRank(1)"><span class="glyphicon glyphicon-arrow-up"></span>&nbsp;从低到高</a>
                        </td>
                    </tr>
                    <tr>
                        <td>评论数量</td>
                        <td>
                            <a class="label label-success" onclick="getCommentRank('desc')"><span class="glyphicon glyphicon-arrow-down"></span>&nbsp;从高到底</a>
                            &nbsp;
                            <a class="label label-danger" onclick="getCommentRank('asc')"><span class="glyphicon glyphicon-arrow-up"></span>&nbsp;从低到高</a>
                        </td>
                    </tr>
                </table>
            </div>
            <div id="videoId">
            <c:forEach items="${videos.list}" var="video">
                <div class="col-md-3">
                    <div class="movielist text-center" style="width:212px;height:280px">
                        <c:if test="${video.videoImages==null}">
                            <img src="${pageContext.request.contextPath}/resource/static/base/images/空白电影.png" class="img-responsive center-block" alt=""  width="200"height="200">
                        </c:if>
                        <c:if test="${video.videoImages!=null}">
                            <img style="height:200px;width:200px" src="${pageContext.request.contextPath}/resource/static/base/images/${video.videoImages.imageName}" class="img-responsive center-block" alt=""  width="200"height="200">
                        </c:if>
                        <div class="text-left" style="xmargin-left:auto;margin-right:auto;width:210px; float: bottom" >
                            <span style="color:#999;font-style: italic;">${video.videoName}</span><br>
                            <div>
                                <c:choose>
                                    <c:when test="${video.videoStart==1}">
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                    </c:when>
                                    <c:when test="${video.videoStart==2}">
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                    </c:when>
                                    <c:when test="${video.videoStart==3}">
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                    </c:when>
                                    <c:when test="${video.videoStart==4}">
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>
                                    </c:when>
                                    <c:otherwise>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                        <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>
                                    </c:otherwise>
                                </c:choose>

                            </div>
                        </div>
                        <a style="float: bottom" href="/film/player/${video.videoId}/${video.videoName}" class="btn btn-primary" target="_blank" role="button" onclick="player(this)"><span class="glyphicon glyphicon-play"></span>&nbsp;播放</a>
                    </div>
                </div>
            </c:forEach>
            </div>
            <div class="col-md-12">
                <nav aria-label="Page navigation">
                    <ul class="pagination" id="pageNav">
                        <li>
                            <a href="javaScript:void(0)" onclick="doGetVideo(1)" aria-label="First">
                                <span aria-hidden="true">首页</span>
                            </a>
                        </li>

                        <li>
                            <c:choose>
                                <c:when test="${videos.isFirstPage}">
                                    <a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideo(1)">
                                        <span aria-hidden="true">上一页</span>
                                    </a>
                                </c:when>
                                <c:otherwise>
                                    <a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideo(${videos.pageNum-1})">
                                        <span aria-hidden="true">上一页</span>
                                    </a>
                                </c:otherwise>
                            </c:choose>
                        </li>
                        <li><a href="#">${videos.pageNum}&nbsp;/&nbsp;${videos.pages}</a></li>
                        <li>
                            <c:choose>
                                <c:when test="${videos.isLastPage}">
                                    <a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideo(${videos.pages})">
                                        <span aria-hidden="true">下一页</span>
                                    </a>
                                </c:when>
                                <c:otherwise>
                                    <a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideo(${videos.pageNum+1})">
                                        <span aria-hidden="true">下一页</span>
                                    </a>
                                </c:otherwise>
                            </c:choose>
                        </li>
                        <li>
                            <a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideo(${videos.pages})">
                                <span aria-hidden="true">尾页</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</section>
<!--电影列表-->
<!--底部-->
<footer>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <p>
                    ©&nbsp;2017&nbsp;flaskmovie.imooc.com&nbsp;京ICP备 13046642号-2
                </p>
            </div>
        </div>
    </div>
</footer>

<script>
    $(function() {
        new WOW().init();
    })

    var image;
    var divClass = $("#videoId")
 function doGetVideo(page){
     if(page ==null){
         page=1
     }
     var formData={
         "page":page,
         "size":12
     }
     $.ajax({
         url:"/film/changePage",
         data:formData,
         type:"get",
         dataType:"json",
         success:function (res){
            // console.log(res.msg)
             var video = res.data.list
             console.log(video)
             divClass.empty();
             for(var i = 0; i < video.length; i ++){
                 if(video[i].videoImages===null ){
                    image='空白电影.png';
                 }else{
                     image=video[i].videoImages.imageName;
                 }
                 changeVideo(video[i]);
             }
             changePage(res.data);
         },
         error:function (){

         }
     })
 }
    function changePage(pageInfo){
        $("#pageNav").empty()
        var firstPage= '<li>'+
            '<a href="javaScript:void(0)" onclick="doGetVideo(1)" aria-label="First">'+
            '<span aria-hidden="true">首页</span>'+
            '</a>'+
            '</li>';
        var prePageNum = 0;
        if(pageInfo.pageNum<=1){
            prePageNum = 1;

        }else{
            prePageNum = pageInfo.pageNum-1;
        }
        var prevPage='<li>'+'<a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideo('+prePageNum+')">'+
            '<span aria-hidden="true">上一页</span>'+
            '</a>'+'</li>';
        var pageThis ='<li><a href="javaScript:void(0)">'+pageInfo.pageNum+'&nbsp;/&nbsp;'+pageInfo.pages+'</a></li>';
        var nextPageNum = 0;
        if(pageInfo.pageNum>=pageInfo.pages){
            nextPageNum = pageInfo.pages
        }else{
            nextPageNum = pageInfo.pageNum + 1;
        }
        var nextPage ='<li>'+
            '<a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideo('+nextPageNum+')">'+
            '<span aria-hidden="true">下一页</span>'+
            '</a>'+
            '</li>';
        var lastPage='<li>'+
            '<a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideo('+pageInfo.pages+')">'+
            '<span aria-hidden="true">尾页</span>'+
            '</a>'+
            '</li>';
        $("#pageNav").append(firstPage);
        $("#pageNav").append(prevPage);
        $("#pageNav").append(pageThis);
        $("#pageNav").append(nextPage);
        $("#pageNav").append(lastPage);
    }

    //todo
    function changeVideo(video){
        var div='<div class="col-md-3">'+
            '<div class="movielist text-center" style="width:212px;height:280px">'+
            '<img style="height:200px;width:200px" src="/resource/static/base/images/'+image+'" class="img-responsive center-block" alt=""  width="200px"height="200px">'+
            '<div class="text-left" style="xmargin-left:auto;margin-right:auto;width:210px;">'+
            '<span style="color:#999;font-style: italic;">'+video.videoName+'</span><br>'+
            '<div>';
        if(video.videoStart == 1){
            div = div + '  <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>';
        }
        else if(video.videoStart == 2){
            div = div + '  <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>';
        }
        else if(video.videoStart == 3){
            div = div + '  <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>';
        }
        else   if(video.videoStart == 4){
            div = div + '  <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star-empty" style="color:#FFD119"></span>';
        }else {
            div = div + '  <span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>'+
                '<span class="glyphicon glyphicon-star" style="color:#FFD119"></span>';
        }
        div = div + ' </div>'+
            ' </div>'+
            ' <a href="/film/player/'+video.videoId+'/'+video.videoName+'   " class="btn btn-primary" target="_blank" role="button" onclick="player(this)"><span class="glyphicon glyphicon-play"></span>&nbsp;播放</a>'+
            '</div>'+
            '</div>';
        divClass.append(div);
    }

 //根据标签搜索
    var tag;
 function getTag(res){
    tag=res.text;
     console.log(tag)
        $.ajax({
            url:"/film/getVideoByTag/"+tag,
            type:"get",
            dataType:"json",
            success:function(res){
                console.log(res)
                var video = res.data.list
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }
                changePageByTag(res.data);

            },
            error:function (e1,e2,e3){
                console.log(e1);
                console.log(e2);
                console.log(e3);
            }
        })
    }


    function doGetVideoByTag(page){
        if(page ==null){
            page=1
        }
        var formData={
            "page":page,
            "size":12,
            "tag":tag
        }
        $.ajax({
            url:"/film/changeVideoByTag",
            data:formData,
            type:"get",
            dataType:"json",
            success:function (res){
                // console.log(res.msg)
                var video = res.data.list
                // console.log(video)
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }

                changePageByTag(res.data);
            },
            error:function (){

            }
        })
    }
    function changePageByTag(pageInfo){
        $("#pageNav").empty()
        var firstPage= '<li>'+
            '<a href="javaScript:void(0)" onclick="doGetVideoByTag(1)" aria-label="First">'+
            '<span aria-hidden="true">首页</span>'+
            '</a>'+
            '</li>';
        var prePageNum = 0;
        if(pageInfo.pageNum<=1){
            prePageNum = 1;

        }else{
            prePageNum = pageInfo.pageNum-1;
        }
        var prevPage='<li>'+'<a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideoByTag('+prePageNum+')">'+
            '<span aria-hidden="true">上一页</span>'+
            '</a>'+'</li>';
        var pageThis ='<li><a href="javaScript:void(0)">'+pageInfo.pageNum+'&nbsp;/&nbsp;'+pageInfo.pages+'</a></li>';
        var nextPageNum = 0;
        if(pageInfo.pageNum>=pageInfo.pages){
            nextPageNum = pageInfo.pages
        }else{
            nextPageNum = pageInfo.pageNum + 1;
        }
        var nextPage ='<li>'+
            '<a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideoByTag('+nextPageNum+')">'+
            '<span aria-hidden="true">下一页</span>'+
            '</a>'+
            '</li>';
        var lastPage='<li>'+
            '<a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideoByTag('+pageInfo.pages+')">'+
            '<span aria-hidden="true">尾页</span>'+
            '</a>'+
            '</li>';
        $("#pageNav").append(firstPage);
        $("#pageNav").append(prevPage);
        $("#pageNav").append(pageThis);
        $("#pageNav").append(nextPage);
        $("#pageNav").append(lastPage);
    }


    //根据星星
    var star;
function getStar(number){
    star=number
    $.ajax({
        url:"/film/getVideoByStar/"+number,
        type:"get",
        dataType:"json",
        success:function(res){
            console.log(res)
            var video = res.data.list
            divClass.empty();
            for(var i = 0; i < video.length; i ++){
                if(video[i].videoImages===null ){
                    image='空白电影.png';
                }else{
                    image=video[i].videoImages.imageName;
                }
                changeVideo(video[i]);
            }
            changePageByStar(res.data);

        },
        error:function (e1,e2,e3){
            console.log(e1);
            console.log(e2);
            console.log(e3);
        }
    })
}
    function doGetVideoByStar(page){
        if(page ==null){
            page=1
        }
        var formData={
            "page":page,
            "size":12,
            "star":star
        }
        $.ajax({
            url:"/film/changeVideoByStar",
            data:formData,
            type:"get",
            dataType:"json",
            success:function (res){
                // console.log(res.msg)
                var video = res.data.list
                // console.log(video)
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }

                changePageByStar(res.data);
            },
            error:function (){

            }
        })
    }
    function changePageByStar(pageInfo){
        $("#pageNav").empty()
        var firstPage= '<li>'+
            '<a href="javaScript:void(0)" onclick="doGetVideoByStar(1)" aria-label="First">'+
            '<span aria-hidden="true">首页</span>'+
            '</a>'+
            '</li>';
        var prePageNum = 0;
        if(pageInfo.pageNum<=1){
            prePageNum = 1;

        }else{
            prePageNum = pageInfo.pageNum-1;
        }
        var prevPage='<li>'+'<a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideoByStar('+prePageNum+')">'+
            '<span aria-hidden="true">上一页</span>'+
            '</a>'+'</li>';
        var pageThis ='<li><a href="javaScript:void(0)">'+pageInfo.pageNum+'&nbsp;/&nbsp;'+pageInfo.pages+'</a></li>';
        var nextPageNum = 0;
        if(pageInfo.pageNum>=pageInfo.pages){
            nextPageNum = pageInfo.pages
        }else{
            nextPageNum = pageInfo.pageNum + 1;
        }
        var nextPage ='<li>'+
            '<a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideoByStar('+nextPageNum+')">'+
            '<span aria-hidden="true">下一页</span>'+
            '</a>'+
            '</li>';
        var lastPage='<li>'+
            '<a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideoByStar('+pageInfo.pages+')">'+
            '<span aria-hidden="true">尾页</span>'+
            '</a>'+
            '</li>';
        $("#pageNav").append(firstPage);
        $("#pageNav").append(prevPage);
        $("#pageNav").append(pageThis);
        $("#pageNav").append(nextPage);
        $("#pageNav").append(lastPage);
    }


    //根据年份
    var Year;
    function getYear(number){
        Year=number
        $.ajax({
            url:"/film/getVideoByYear/"+number,
            type:"get",
            dataType:"json",
            success:function(res){
                console.log(res)
                var video = res.data.list
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }
                changePageByYear(res.data);

            },
            error:function (e1,e2,e3){
                console.log(e1);
                console.log(e2);
                console.log(e3);
            }
        })
    }
    function doGetVideoByYear(page){
        if(page ==null){
            page=1
        }
        var formData={
            "page":page,
            "size":12,
            "Year":Year
        }
        $.ajax({
            url:"/film/changeVideoByYear",
            data:formData,
            type:"get",
            dataType:"json",
            success:function (res){
                // console.log(res.msg)
                var video = res.data.list
                // console.log(video)
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }

                changePageByYear(res.data);
            },
            error:function (){

            }
        })
    }
    function changePageByYear(pageInfo){
        $("#pageNav").empty()
        var firstPage= '<li>'+
            '<a href="javaScript:void(0)" onclick="doGetVideoByYear(1)" aria-label="First">'+
            '<span aria-hidden="true">首页</span>'+
            '</a>'+
            '</li>';
        var prePageNum = 0;
        if(pageInfo.pageNum<=1){
            prePageNum = 1;

        }else{
            prePageNum = pageInfo.pageNum-1;
        }
        var prevPage='<li>'+'<a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideoByYear('+prePageNum+')">'+
            '<span aria-hidden="true">上一页</span>'+
            '</a>'+'</li>';
        var pageThis ='<li><a href="javaScript:void(0)">'+pageInfo.pageNum+'&nbsp;/&nbsp;'+pageInfo.pages+'</a></li>';
        var nextPageNum = 0;
        if(pageInfo.pageNum>=pageInfo.pages){
            nextPageNum = pageInfo.pages
        }else{
            nextPageNum = pageInfo.pageNum + 1;
        }
        var nextPage ='<li>'+
            '<a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideoByYear('+nextPageNum+')">'+
            '<span aria-hidden="true">下一页</span>'+
            '</a>'+
            '</li>';
        var lastPage='<li>'+
            '<a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideoByYear('+pageInfo.pages+')">'+
            '<span aria-hidden="true">尾页</span>'+
            '</a>'+
            '</li>';
        $("#pageNav").append(firstPage);
        $("#pageNav").append(prevPage);
        $("#pageNav").append(pageThis);
        $("#pageNav").append(nextPage);
        $("#pageNav").append(lastPage);
    }
    //根据播放数量排序
    var playNmu;
    function getPlayRank(number){
        playNmu=number
        console.log(playNmu)
        $.ajax({
            url:"/film/getVideoByPlay/"+number,
            type:"get",
            dataType:"json",
            success:function(res){
                console.log(res)
                var video = res.data.list
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }
                changePageByPlay(res.data);

            },
            error:function (e1,e2,e3){
                console.log(e1);
                console.log(e2);
                console.log(e3);
            }
        })
    }
    function doGetVideoByPlay(page){
        if(page ==null){
            page=1
        }
        var formData={
            "page":page,
            "size":12,
            "playNmu":playNmu
        }
        $.ajax({
            url:"/film/changeVideoByPlay",
            data:formData,
            type:"get",
            dataType:"json",
            success:function (res){
                // console.log(res.msg)
                var video = res.data.list
                // console.log(video)
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }

                changePageByPlay(res.data);
            },
            error:function (){

            }
        })
    }
    function changePageByPlay(pageInfo){
        $("#pageNav").empty()
        var firstPage= '<li>'+
            '<a href="javaScript:void(0)" onclick="doGetVideoByPlay(1)" aria-label="First">'+
            '<span aria-hidden="true">首页</span>'+
            '</a>'+
            '</li>';
        var prePageNum = 0;
        if(pageInfo.pageNum<=1){
            prePageNum = 1;

        }else{
            prePageNum = pageInfo.pageNum-1;
        }
        var prevPage='<li>'+'<a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideoByPlay('+prePageNum+')">'+
            '<span aria-hidden="true">上一页</span>'+
            '</a>'+'</li>';
        var pageThis ='<li><a href="javaScript:void(0)">'+pageInfo.pageNum+'&nbsp;/&nbsp;'+pageInfo.pages+'</a></li>';
        var nextPageNum = 0;
        if(pageInfo.pageNum>=pageInfo.pages){
            nextPageNum = pageInfo.pages
        }else{
            nextPageNum = pageInfo.pageNum + 1;
        }
        var nextPage ='<li>'+
            '<a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideoByPlay('+nextPageNum+')">'+
            '<span aria-hidden="true">下一页</span>'+
            '</a>'+
            '</li>';
        var lastPage='<li>'+
            '<a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideoByPlay('+pageInfo.pages+')">'+
            '<span aria-hidden="true">尾页</span>'+
            '</a>'+
            '</li>';
        $("#pageNav").append(firstPage);
        $("#pageNav").append(prevPage);
        $("#pageNav").append(pageThis);
        $("#pageNav").append(nextPage);
        $("#pageNav").append(lastPage);
    }
    //根据评论数量排序
    var commentNum;
    function getCommentRank(number){
        commentNum=number
        $.ajax({
            url:"/film/getCommentRank/"+number,
            type:"get",
            dataType:"json",
            success:function(res){
                console.log(res)
                var video = res.data.list
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }
                changePageByCom(res.data);

            },
            error:function (e1,e2,e3){
                console.log(e1);
                console.log(e2);
                console.log(e3);
            }
        })
    }
    function doGetVideoByCom(page){
        if(page ==null){
            page=1
        }
        var formData={
            "page":page,
            "size":12,
            "commentNum":commentNum
        }
        $.ajax({
            url:"/film/doGetVideoByCom",
            data:formData,
            type:"get",
            dataType:"json",
            success:function (res){
                // console.log(res.msg)
                var video = res.data.list
                // console.log(video)
                divClass.empty();
                for(var i = 0; i < video.length; i ++){
                    if(video[i].videoImages===null ){
                        image='空白电影.png';
                    }else{
                        image=video[i].videoImages.imageName;
                    }
                    changeVideo(video[i]);
                }

                changePageByCom(res.data);
            },
            error:function (){

            }
        })
    }
    function changePageByCom(pageInfo){
        $("#pageNav").empty()
        var firstPage= '<li>'+
            '<a href="javaScript:void(0)" onclick="doGetVideoByCom(1)" aria-label="First">'+
            '<span aria-hidden="true">首页</span>'+
            '</a>'+
            '</li>';
        var prePageNum = 0;
        if(pageInfo.pageNum<=1){
            prePageNum = 1;

        }else{
            prePageNum = pageInfo.pageNum-1;
        }
        var prevPage='<li>'+'<a href="javaScript:void(0)" aria-label="Previous" onclick="doGetVideoByCom('+prePageNum+')">'+
            '<span aria-hidden="true">上一页</span>'+
            '</a>'+'</li>';
        var pageThis ='<li><a href="javaScript:void(0)">'+pageInfo.pageNum+'&nbsp;/&nbsp;'+pageInfo.pages+'</a></li>';
        var nextPageNum = 0;
        if(pageInfo.pageNum>=pageInfo.pages){
            nextPageNum = pageInfo.pages
        }else{
            nextPageNum = pageInfo.pageNum + 1;
        }
        var nextPage ='<li>'+
            '<a href="javaScript:void(0)" aria-label="Next" onclick="doGetVideoByCom('+nextPageNum+')">'+
            '<span aria-hidden="true">下一页</span>'+
            '</a>'+
            '</li>';
        var lastPage='<li>'+
            '<a href="javaScript:void(0)" aria-label="Last" onclick="doGetVideoByCom('+pageInfo.pages+')">'+
            '<span aria-hidden="true">尾页</span>'+
            '</a>'+
            '</li>';
        $("#pageNav").append(firstPage);
        $("#pageNav").append(prevPage);
        $("#pageNav").append(pageThis);
        $("#pageNav").append(nextPage);
        $("#pageNav").append(lastPage);
    }
</script>
</body>
</html>
